<template>
  <el-form ref="ruleFormRef" style="max-width: 600px" :model="adddata" :rules="rules" label-width="auto"
    class="demo-ruleForm" :size="formSize" status-icon>

    <el-form-item label="操作时间" required>
      <el-col :span="11">
        <el-form-item prop="heightTime">
          <el-date-picker v-model="adddata.heightTime" type="date" aria-label="Pick a date" placeholder="请选择操作时间"
            style="width: 100%" />
        </el-form-item>
      </el-col>
    </el-form-item>
<!--
    <el-form-item label="耳号" >
      <el-select v-model="adddata.earTypesId" placeholder="请选择" style="width: 200px;" >
        <el-option v-for="item in idCardsList" :label="item.EarTypesName" :value="item.earTypesId" />
      </el-select>
    </el-form-item> -->



    <tr>
      <td>
        <el-form-item label="身高(cm)" prop="heightHeight">
          <el-input v-model="adddata.heightHeight"  />
        </el-form-item>

        <el-form-item label="体长(cm)" prop="heightWhight">
          <el-input v-model="adddata.heightWhight" />
        </el-form-item>
      </td>
    </tr>

    <tr>
      <td>
        <el-form-item label="胸围(cm)" prop="heightXiong">
          <el-input v-model="adddata.heightXiong" />
        </el-form-item>

        <el-form-item label="腰围(cm)" prop="heightWaist">
          <el-input v-model="adddata.heightWaist" />
        </el-form-item>
      </td>
    </tr>

    <tr>
      <td>
        <el-form-item label="阴囊围(cm)" prop="heightScrotum">
          <el-input v-model="adddata.heightScrotum" />
        </el-form-item>
        <el-form-item label="背膘厚度(cm)" prop="heightBack">
          <el-input v-model="adddata.heightBack" />
        </el-form-item>
      </td>
    </tr>

    <tr>
      <td>
        <el-form-item label="眼肌面积(cm)" prop="heightEye">
          <el-input v-model="adddata.heightEye" />
        </el-form-item>
        <el-form-item label="眼肌宽度(cm)" prop="heightWide">
          <el-input v-model="adddata.heightWide" />
        </el-form-item>
      </td>
    </tr>


    <el-form-item>
      <el-button type="primary" @click="submitForm(ruleFormRef)">
        添加
      </el-button>
    </el-form-item>



  </el-form>
</template>

<script lang="ts" setup>
import axios from 'axios';
import { ref, reactive, onMounted } from 'vue'
import { ElMessage, ElMessageBox } from 'element-plus'
import { useRoute, useRouter } from 'vue-router'
import { Delete, Edit, Search, Share, Upload } from '@element-plus/icons-vue'
import type { ComponentSize, FormInstance, FormRules } from 'element-plus'
import { Plus } from '@element-plus/icons-vue'
import type { UploadProps, UploadUserFile } from 'element-plus'

const apiUrl = import.meta.env.VITE_APP_API_URL;
const apiBedinUrl = import.meta.env.VITE_APPRead_API_URL;

const route = useRoute()
const router = useRouter()


const formSize = ref<ComponentSize>('default')
const ruleFormRef = ref<FormInstance>()
const adddata = reactive({

  heightEar: '',
  heightType: '',
  heightSex: '',
  heightSleep: '',
  heightseat: '',
  heightTime: '',
  heightAge: '',
  heightHeight: '',
  heightWhight: '',
  heightXiong: '',
  heightWaist: '',
  heightScrotum: '',
  heightBack: '',
  heightEye: '',
  heightWide: '',
  EarTypesName: '',
  earTypesId:'',


})

const locationOptions = ['Home', 'Company', 'School']

const rules = reactive<FormRules>({
  heightTime: [
    { required: true, message: '请输选择操作时间', trigger: 'blur' },
  ],
  heightEar: [
    { required: true, message: '请输选择耳号', trigger: 'blur' },
  ],

})

// //耳号列表
// const idCardsList=ref([]);
// const GetidCard=()=>{
//     axios.post(apiUrl+'/api/Ear/Handle',{})
//     .then(res=>{
//         idCardsList.value = res.data.data;
//     })
// }

const submitForm = async (formEl: FormInstance | undefined) => {
  if (!formEl) return
  await formEl.validate((valid, fields) => {
    if (valid) {
      axios.post(apiUrl+'/api/Height/addHeight', adddata).then((res) => {
        if (res.data.code == 0) {
          ElMessage.success('添加成功')
          router.push('/ShowHeight')
        } else {
          ElMessage.error('添加失败')
        }
      })


    }
  })
}

// onMounted(() => {
//   GetidCard();
// })
</script>
